<template>
  <div>
    <div class="nav bg-theme color-f text-c">
        <i class="iconfont icon-huishouye font19 pl08 iback2" @click="goHome"></i>
        <span class="font19 ml16">设置</span>
    </div>
    <div class="wrap">
        <div class="piece">
            <div class="left font16 display-ib">头像</div>
            <div class="right font16 display-ib">
                <img :src="user.photo" alt="头像" class="head">
            </div>
        </div>
        <div class="piece">
            <div class="left font16 display-ib">姓名</div>
            <div class="right font16 display-ib">{{user.truename}}</div>
        </div>
        <div class="piece">
            <div class="left font16 display-ib">手机号</div>
            <div class="right font16 display-ib">{{user.preferredMobile}}</div>
        </div>
        <div class="piece">
            <div class="left font16 display-ib">部门</div>
            <div class="right font16 display-ib">{{user.belongOrgName === user.belongDepartmentName ? user.belongOrgName : user.belongOrgName +'/'+user.belongDepartmentName}}</div>
        </div>
    </div>
    <van-button @click="logOut" type="primary" plain block style="margin:10px 0;border:none;">退出</van-button>
    
  </div>
</template>
<script>
import { Notify } from 'vant';
import { Dialog } from 'vant';
import {mapGetters} from 'vuex';
import store from "@/store";

export default {
  name: "set",
  computed:{
    ...mapGetters([
        'user'
    ])
   },
  data() {
    return {

    };
  },
  created() {

  },
  methods: {
    goHome(){
      this.$router.push({ path: "/home" });   //返回上一页  
    },
    logOut() {
        Dialog.confirm({
            title: '',
            message: '确定退出登录吗',
        })
        .then(() => {
            // on confirm  
            store.dispatch("FedLogOut").then(outs => {
              this.$router.push('/login');
            });
        })
        .catch(() => {
            // on cancel
        });
    },

  }
} 
</script>
<style scoped>
    .wrap {
        width: 100%;
        padding: 50px 0 0 16px;
    }
    .piece {
        width: 100%;
        padding: 13px 22px 13px 0;
        border-bottom: 1px solid #EEEEEE;
    }
    .left {
        width: 60px;
        text-align: left;  
        color: #222;
        vertical-align: middle;
    }
    .right {
        width: 275px;
        text-align: right;
        color: #222;
        vertical-align: middle;
    }
    .head {
        width: 34px;
        height: 34px;
        background: #fff;
        border-radius: 50%;
        vertical-align: top;
        display: inline-block;
    }
    .van-button__content {
        font-size: 14px;
        color: #0080CB;
    }
</style>
<style>
    .van-dialog__header,
    .van-button__content {
        font-size: unset;
    }
</style>

